<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>

<!--
    window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。
    location.hostname 返回 web 主机的域名
    location.pathname 返回当前页面的路径和文件名
    location.port 返回 web 主机的端口 （80 或 443）
    location.protocol 返回所使用的 web 协议（http: 或 https:）

    href:
    replace:
-->
<button id="btn">百度</button>
<button id="pay">支付</button>
<button id="ref">刷新</button>

<script>
    // location是window对象的属性  属性值时一个对象
    var location_obj = window.location
    console.log(location_obj)
    console.log(typeof location_obj)

    // 获取location对象中的属性值
    console.log('port = ', location_obj.port)
    console.log('host = ', location_obj.host)
    console.log('hostname = ', location_obj.hostname)
    console.log('protocol = ', location_obj.protocol)  //  http  https
    // 获取浏览器的路径参数
    console.log('search = ', location_obj.search)
    // 获取url
    console.log('href = ', location_obj.href)

    document.getElementById('btn').onclick = function () {
        // 网页跳转   保存历史记录
        // location_obj.href = 'http://www.baidu.com'
        // 替换  不保存历史记录
        location_obj.replace('http://www.baidu.com')
    }

    document.getElementById('pay').onclick = function () {
        // 网页跳转   保存历史记录
        location_obj.href = './08-paysuccess.html'
    }

     document.getElementById('ref').onclick = function () {
        // 网页刷新
        window.location.reload()
    }

</script>

</body>
</html>